<!DOCTYPE html>
<html>

<head>
	<meta charset="utf-8" />
	<meta http-equiv="X-UA-Compatible" content="IE=9; IE=8; IE=7; IE=EDGE">
	<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
	<title>产品详情页</title>
	 <link rel="icon" href="assets/img/favicon.ico">

    <link rel="stylesheet" type="text/css" href="css/webbase.css" />
    <link rel="stylesheet" type="text/css" href="css/pages-item.css" />
    <link rel="stylesheet" type="text/css" href="css/pages-zoom.css" />
    <link rel="stylesheet" type="text/css" href="css/widget-cartPanelView.css" />
	<script type="text/javascript" src="plugins/angularjs/angular.min.js">  </script>
	<script type="text/javascript" src="js/module/common.js">  </script>
	<script type="text/javascript" src="js/controller/itemController.js">  </script>
	<script>
		var skuList=[
							{
					id:1369300,
					title:'测试手机 移动4G 32G',
					price:1,
					spec:{"网络":"移动4G","机身内存":"32G"},
				},
				{
					id:1369301,
					title:'测试手机 联通3G 32G',
					price:1,
					spec:{"网络":"联通3G","机身内存":"32G"},
				},
		];
	</script>
</head>
<body ng-app="diploma" ng-controller="itemController" ng-init="loadSku()">
<!--页面顶部 开始-->
<div id="nav-bottom">
    <!--顶部-->
    <div class="nav-top">
        <div class="top">
            <div class="py-container">
                <div class="shortcut">
                    <ul class="fl">
                        <li class="f-item">欢迎您！</li>
                    </ul>
                    <ul class="fr">
                        <li class="f-item"><a href="http://localhost:8087/home-index.html" target="_blank">我的中心</a></li>
                        <li class="f-item space"></li>
                        <li class="f-item"><a href="http://localhost:8087/register.html" target="_blank">免费注册</a></li>
                    </ul>
                </div>
            </div>
        </div>

        <!--头部-->
        <div class="header">
            <div class="py-container">
                <div class="yui3-g Logo">
                    <div class="yui3-u Left logoArea">
                    </div>
                    <div class="yui3-u Center searchArea">
                        <div class="search">
                            <form action="" class="sui-form form-inline">
                                <!--searchAutoComplete-->
                                <div class="input-append">
                                    <input type="text" id="autocomplete" type="text" ng-model="keywords" class="input-error input-xxlarge" />
                                    <button class="sui-btn btn-xlarge btn-danger" ng-click="search()" type="button">搜索</button>
                                </div>
                            </form>
                        </div>
                    </div>
                    <div class="yui3-u Right shopArea">
                        <div class="fr shopcar">
                            <div class="show-shopcar" id="shopcar">
                                <span class="car"></span>
                                <a class="sui-btn btn-default btn-xlarge" href="http://localhost:8089/cart.html" target="_blank">
                                    <span>我的购物车</span>
                                </a>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="yui3-g NavList">
                    <div class="yui3-u Left all-sort">
                        <h4>全部商品分类</h4>
                    </div>
                    <div class="yui3-u Right"></div>
                </div>
            </div>
        </div>
    </div>
</div><!--页面顶部 结束-->
	<div class="py-container">
		<div id="item">
			<div class="crumb-wrap">
				<ul class="sui-breadcrumb">
					<li>
						<a href="#">手机</a>
					</li>
					<li>
						<a href="#">手机通讯</a>
					</li>
					<li>
						<a href="#">手机</a>
					</li>
				</ul>
			</div>
			<!--product-info-->
			<div class="product-info">
				<div class="fl preview-wrap">
					<!--放大镜效果-->
					<div class="zoom">
						<!--默认第一个预览-->
						<div id="preview" class="spec-preview">
								<span class="jqzoom"><img jqimg="http://192.168.176.134:8888/group1/M00/00/00/wKiwhl6StcmAJswTAAEMfK80fuc172.png" src="http://192.168.176.134:8888/group1/M00/00/00/wKiwhl6StcmAJswTAAEMfK80fuc172.png" width="400" height="400"/></span>
						</div>
						<!--下方的缩略图-->
						<div class="spec-scroll">
							<a class="prev">&lt;</a>
							<!--左右按钮-->
							<div class="items">
								<ul>
										<li><img src="http://192.168.176.134:8888/group1/M00/00/00/wKiwhl6StcmAJswTAAEMfK80fuc172.png" bimg="http://192.168.176.134:8888/group1/M00/00/00/wKiwhl6StcmAJswTAAEMfK80fuc172.png" onmousemove="preview(this)" /></li>

								</ul>
							</div>
							<a class="next">&gt;</a>
						</div>
					</div>
				</div>
				<div class="fr itemInfo-wrap">
					<div class="sku-name">
						<h4>{{sku.title}}</h4>
					</div>
					<div class="news"><span>热卖中</span></div>
					<div class="summary">
						<div class="summary-wrap">
							<div class="fl title">
								<i>价　　格</i>
							</div>
							<div class="fl price">
								<i>¥</i>
								<em>{{sku.price}}</em>
								<span>降价通知</span>
							</div>
							<div class="fr remark">
								<i>累计评价</i><em>612188</em>
							</div>
						</div>
						<div class="summary-wrap">
							<div class="fl title">
								<i>促　　销</i>
							</div>
							<div class="fl fix-width">
								<i class="red-bg">加价购</i>
								<em class="t-gray">满999.00另加20.00元，或满1999.00另加30.00元，或满2999.00另加40.00元，即可在购物车换
购热销商品</em>
							</div>
						</div>
					</div>
					<div class="support">
						<div class="summary-wrap">
							<div class="fl title">
								<i>支　　持</i>
							</div>
							<div class="fl fix-width">
								<em class="t-gray">以旧换新，闲置手机回收  4G套餐超值抢  礼品购</em>
							</div>
						</div>
						<div class="summary-wrap">
							<div class="fl title">
								<i>配 送 至</i>
							</div>
							<div class="fl fix-width">
								<em class="t-gray">全国任意地区</em>
							</div>
						</div>
					</div>
					<div class="clearfix choose">
						<div id="specification" class="summary-wrap clearfix">
							<dl>
								<dt>
									<div class="fl title">
									<i>网络</i>
								</div>
								</dt>
								<dd><a href="javascript:;" class="{{isSelected('网络','移动4G')?'selected':''}}"
									   ng-click="selectSpecification('网络','移动4G')">
										移动4G<span title="点击取消选择">&nbsp;</span>
									</a></dd>
								<dd><a href="javascript:;" class="{{isSelected('网络','联通3G')?'selected':''}}"
									   ng-click="selectSpecification('网络','联通3G')">
										联通3G<span title="点击取消选择">&nbsp;</span>
									</a></dd>
							</dl>
							<dl>
								<dt>
									<div class="fl title">
									<i>机身内存</i>
								</div>
								</dt>
								<dd><a href="javascript:;" class="{{isSelected('机身内存','32G')?'selected':''}}"
									   ng-click="selectSpecification('机身内存','32G')">
										32G<span title="点击取消选择">&nbsp;</span>
									</a></dd>
							</dl>
						</div>

						<div class="summary-wrap">
							<div class="fl title">
								<div class="control-group">
									<div class="controls">
										<input autocomplete="off" ng-model="num" type="text" value="1" minnum="1" class="itxt" />
										<a href="javascript:void(0)" class="increment plus" ng-click="addNum(1)">+</a>
										<a href="javascript:void(0)" class="increment mins" ng-click="addNum(-1)">-</a>
									</div>
								</div>
							</div>
							<div class="fl">
								<ul class="btn-choose unstyled">
									<li>
										<a class="sui-btn  btn-danger addshopcar" ng-click="addToCart()">加入购物车</a>
									</li>
								</ul>
							</div>
						</div>
					</div>
				</div>
			</div>
			<!--product-detail-->
			<div class="clearfix product-detail">
					<div class="fl aside">
						<ul class="sui-nav nav-tabs tab-wraped">
							<li class="active">
								<a href="#index" data-toggle="tab">
									<span>相关分类</span>
								</a>
							</li>
							<li>
								<a href="#profile" data-toggle="tab">
									<span>推荐品牌</span>
								</a>
							</li>
						</ul>
						<div class="tab-content tab-wraped">
							<div id="index" class="tab-pane active">
								<ul class="part-list unstyled">
									<li>手机</li>
									<li>手机壳</li>
									<li>内存卡</li>
									<li>Iphone配件</li>
									<li>贴膜</li>
									<li>手机耳机</li>
									<li>移动电源</li>
									<li>平板电脑</li>
								</ul>
								<ul class="goods-list unstyled">
									<li>
										<div class="list-wrap">
											<div class="p-img">
												<img src="img/_/part01.png" />
											</div>
											<div class="attr">
												<em>Apple苹果iPhone 6s (A1699)</em>
											</div>
											<div class="price">
												<strong>
													<em>¥</em>
													<i>6088.00</i>
												</strong>
											</div>
											<div class="operate">
												<a href="javascript:void(0);" class="sui-btn btn-bordered">加入购物车</a>
											</div>
										</div>
									</li>
									<li>
										<div class="list-wrap">
											<div class="p-img">
												<img src="img/_/part02.png" />
											</div>
											<div class="attr">
												<em>Apple苹果iPhone 6s (A1699)</em>
											</div>
											<div class="price">
												<strong>
													<em>¥</em>
													<i>6088.00</i>
												</strong>
											</div>
											<div class="operate">
												<a href="javascript:void(0);" class="sui-btn btn-bordered">加入购物车</a>
											</div>
										</div>
									</li>
									<li>
										<div class="list-wrap">
											<div class="p-img">
												<img src="img/_/part03.png" />
											</div>
											<div class="attr">
												<em>Apple苹果iPhone 6s (A1699)</em>
											</div>
											<div class="price">
												<strong>
													<em>¥</em>
													<i>6088.00</i>
												</strong>
											</div>
											<div class="operate">
												<a href="javascript:void(0);" class="sui-btn btn-bordered">加入购物车</a>
											</div>
										</div>
										<div class="list-wrap">
											<div class="p-img">
												<img src="img/_/part02.png" />
											</div>
											<div class="attr">
												<em>Apple苹果iPhone 6s (A1699)</em>
											</div>
											<div class="price">
												<strong>
													<em>¥</em>
													<i>6088.00</i>
												</strong>
											</div>
											<div class="operate">
												<a href="javascript:void(0);" class="sui-btn btn-bordered">加入购物车</a>
											</div>
										</div>
										<div class="list-wrap">
											<div class="p-img">
												<img src="img/_/part03.png" />
											</div>
											<div class="attr">
												<em>Apple苹果iPhone 6s (A1699)</em>
											</div>
											<div class="price">
												<strong>
													<em>¥</em>
													<i>6088.00</i>
												</strong>
											</div>
											<div class="operate">
												<a href="javascript:void(0);" class="sui-btn btn-bordered">加入购物车</a>
											</div>
										</div>
									</li>
								</ul>
							</div>
							<div id="profile" class="tab-pane">
								<p>推荐品牌</p>
							</div>
						</div>
					</div>
					<div class="fr detail">
					<div class="tab-main intro">
						<ul class="sui-nav nav-tabs tab-wraped">
							<li class="active">
								<a href="#one" data-toggle="tab">
									<span>商品介绍</span>
								</a>
							</li>
							<li>
								<a href="#two" data-toggle="tab">
									<span>规格与包装</span>
								</a>
							</li>
							<li>
								<a href="#three" data-toggle="tab">
									<span>售后保障</span>
								</a>
							</li>
						</ul>
						<div class="clearfix"></div>
						<div class="tab-content tab-wraped">
							<div id="one" class="tab-pane active">
								<ul class="goods-intro unstyled">
											<li>内存大小：32G</li>

											<li>颜色：金色</li>

								</ul>
								<div class="intro-detail">
									非常棒<img src="http://localhost:8082/plugins/kindeditor/plugins/emoticons/images/1.gif" alt="" border="0" />
								</div>
							</div>
							<div id="two" class="tab-pane">
								<p>三包</p>
							</div>
							<div id="three" class="tab-pane">
								<p>无售后</p>
							</div>
						</div>
					</div>
				</div>

			</div>
		</div>
	</div>
	<!-- 底部栏位 -->

<!--页面底部  开始 -->
<div class="clearfix footer">
    <div class="py-container">
        <div class="footlink">
            <div class="clearfix Mod-list">
                <div class="yui3-g">
                    <div class="yui3-u-1-6">
                        <h4>购物指南</h4>
                        <ul class="unstyled">
                            <li>购物流程</li>
                            <li>会员介绍</li>
                            <li>生活旅行</li>
                            <li>常见问题</li>
                            <li>购物指南</li>
                        </ul>

                    </div>
                    <div class="yui3-u-1-6">
                        <h4>配送方式</h4>
                        <ul class="unstyled">
                            <li>上门自提</li>
                            <li>211限时达</li>
                            <li>配送服务查询</li>
                            <li>配送费收取标准</li>
                            <li>海外配送</li>
                        </ul>
                    </div>
                    <div class="yui3-u-1-6">
                        <h4>支付方式</h4>
                        <ul class="unstyled">
                            <li>货到付款</li>
                            <li>在线支付</li>
                            <li>分期付款</li>
                            <li>公司转账</li>
                        </ul>
                    </div>
                    <div class="yui3-u-1-6">
                        <h4>售后服务</h4>
                        <ul class="unstyled">
                            <li>售后政策</li>
                            <li>价格保护</li>
                            <li>退款说明</li>
                            <li>返修/退换货</li>
                            <li>取消订单</li>
                        </ul>
                    </div>
                    <div class="yui3-u-1-6">
                        <h4>特色服务</h4>
                        <ul class="unstyled">
                            <li>夺宝岛</li>
                            <li>DIY装机</li>
                            <li>延保服务</li>
                            <li>京东E卡</li>
                            <li>京东通信</li>
                        </ul>
                    </div>
                    <div class="yui3-u-1-6">
                        <h4>自营覆盖县区</h4>
                        <p> 京东以向全国 2661 个区县提供自营配送服务，支持货到付款，POS 机刷卡和售后上门服务</p>
                    </div>
                </div>
            </div>
            <div class="Mod-copyright">
                <ul class="helpLink">
                    <li>关于我们<span class="space"></span></li>
                    <li>联系我们<span class="space"></span></li>
                    <li>关于我们<span class="space"></span></li>
                    <li>商家入驻<span class="space"></span></li>
                    <li>营销中心<span class="space"></span></li>
                    <li>友情链接<span class="space"></span></li>
                    <li>关于我们<span class="space"></span></li>
                    <li>营销中心<span class="space"></span></li>
                    <li>友情链接<span class="space"></span></li>
                    <li>关于我们</li>
                </ul>
                <div class="address">地址：山东省济南市长清区大学路3501号 邮编：250306 电话：0531-89631717 传真：0531—8963106889631968</div>
                <div class="beian">鲁ICP备20003112号鲁公网安备37099202000006
                </div>
            </div>
        </div>
    </div>
</div>
<script type="text/javascript" src="js/plugins/jquery/jquery.min.js"></script>
<script type="text/javascript">
    $(function(){
        $("#service").hover(function(){
            $(".service").show();
        },function(){
            $(".service").hide();
        });
        $("#shopcar").hover(function(){
            $("#shopcarlist").show();
        },function(){
            $("#shopcarlist").hide();
        });

    })
</script>
<script type="text/javascript" src="js/model/cartModel.js"></script>
<script type="text/javascript" src="js/plugins/jquery.easing/jquery.easing.min.js"></script>
<script type="text/javascript" src="js/plugins/sui/sui.min.js"></script>
<script type="text/javascript" src="js/plugins/jquery.jqzoom/jquery.jqzoom.js"></script>
<script type="text/javascript" src="js/plugins/jquery.jqzoom/zoom.js"></script>

<!--页面底部  结束 -->
</body>

</html>